window.onload = function(){
		function getstyle(obj,x){
			return obj.currentStyle ? obj.currentStyle[x] : getComputedStyle(obj,null)[x];
		}
//		左侧滑动效果
		var imgul = document.getElementById("imgul");
		var lis1 = imgul.getElementsByTagName('li');
		var small = document.getElementById("small");
		var small_up = small.getElementsByTagName('div')[0];
		var small_down = small.getElementsByTagName('div')[1];
		var img400 = document.getElementById("img400");
		var img800 = document.getElementById("img800");
		
		small_down.onclick = function(){
//			lis1[0].style.position = 'absolute';
//			lis1[0].style.top = '-100px';
			lis1[0].style.display = 'none';
			small_down.style.backgroundPosition = '-1927px 0px';
			small_up.style.backgroundPosition = '0 -125px';
		}
		small_up.onclick = function(){
//			lis1[0].style.position = '';
//			lis1[0].style.top = '';
			lis1[0].style.display = 'block';
			small_down.style.backgroundPosition = '0 -136px';
			small_up.style.backgroundPosition = '-3270px 0';
		}
//		给左侧图片添加移入事件
		for (var i=0;i<lis1.length;i++) {
			lis1[i].tmp = i;
			lis1[i].onmouseover = function(){
				for (var j=0;j<lis1.length;j++) {
					lis1[j].className = '';
				}
				this.className = 'onmouseoverimg';
				img400.src ='images/400_0'+this.tmp+'.jpg';
				img800.src ='images/800_0'+this.tmp+'.jpg';
			}
		}
//		给400*400图片添加移动事件
		var left = document.getElementById("left");
		var le = left.getElementsByTagName('div')[0];
		var sel = le.getElementsByTagName('div')[0];
		var cover = le.getElementsByTagName('div')[1];
		var right = document.getElementById("right");
		cover.onmousemove = function(e){
//			事件对象的兼容性
			var ev = window.event || e;
//			获取鼠标与事件源之间的距离
			var cover_l = ev.layerX || ev.offsetX;
			var cover_r = ev.layerY || ev.offsetY;
//			计算小方块的位置
			var sel_l = cover_l - 100;
			var sel_r = cover_r - 100;
//			判断边界
			if (sel_l<0) {
				sel_l = 0;
			}
			if (sel_l>340) {
				sel_l = 340;
			}
			if (sel_r<0) {
				sel_r = 0;
			}
			if (sel_r>320) {
				sel_r = 320;
			}
//			赋值回去
			sel.style.left = sel_l + 'px';
			sel.style.top = sel_r + 'px';
//			计算800*800图片的位置并赋值回去
			var big_l = sel_l*-2;			
			var big_r = sel_r*-2;			
			img800.style.left = big_l + 'px';
			img800.style.top = big_r + 'px';
		}
//		添加鼠标移入事件
		cover.onmouseover = function(){
			sel.style.display = 'block';
			right.style.display = 'block';
		}
//		添加鼠标移出事件
		cover.onmouseout = function(){
			sel.style.display = 'none';
			right.style.display = 'none';
		}
		

		window.onscroll = function(){
//			滚动条特效
			var hide_top = window.pageYOffset;
//			document.title = hide_top;
			if (hide_top>80) {
				right.style.top = hide_top - 80 +'px';
			}else{
				right.style.top = -70 +'px';
			}
			var btn = document.documentElement.clientHeight-470;
			if (btn<0) {
				right.style.top = hide_top - 150 +'px';
			}
		}
	}
	